<template>
  <el-form ref="searchForm" :model="searchForm" label-width="120px">
    <el-row v-if="conditionCount > 0">
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="英文" prop="dictCode" label-for="dictCode">
          <el-input
            v-model="searchForm.dictCode"
            element-id="dictCode"
            placeholder="请输入英文"
            clearable
            @keyup.enter.native="handleSubmit"
          />
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="中文" prop="dictName" label-for="dictName">
          <el-input
            v-model="searchForm.dictName"
            element-id="dictName"
            placeholder="请输入中文"
            clearable
            @keyup.enter.native="handleSubmit"
          />
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-button
          type="primary"
          style="margin-left: 10px;"
          :loading="loading.search"
          @click="handleSubmit"
        >搜索</el-button>
        <el-button @click="handleReset">重置</el-button>
        <a v-if="conditionCount > 3" style="margin-left: 10px;" @click="collapse = !collapse">
          <el-button v-if="!collapse" type="text">
            展开
            <svg-icon icon-class="ios-arrow-down" />
          </el-button>
          <el-button v-else type="text">
            收起
            <svg-icon icon-class="ios-arrow-up" />
          </el-button>
        </a>
      </el-col>
    </el-row>
    <el-row v-if="collapse" />
  </el-form>
</template>
<script>
import * as utils from '@/utils/utils'
import * as ResponseStatus from '@/utils/response-status'
export default {
  name: 'DataDictItemSearchQuick',
  data() {
    return {
      loading: {
        search: false
      },
      conditionCount: 2,
      collapse: false,
      searchForm: {
        pageNo: 1,
        pageSize: 10,
        sortColumn: undefined,
        sortOrder: undefined,
        id: undefined,
        idMin: undefined,
        idMax: undefined,
        dictId: undefined,
        dictIdMin: undefined,
        dictIdMax: undefined,
        dictCode: undefined,
        dictName: undefined,
        dictIsActive: undefined,
        dictIsActiveMin: undefined,
        dictIsActiveMax: undefined,
        value: undefined,
        valueMin: undefined,
        valueMax: undefined,
        displayValue: undefined,
        itemOrder: undefined,
        itemOrderMin: undefined,
        itemOrderMax: undefined,
        color: undefined,
        isDefault: undefined,
        isDefaultMin: undefined,
        isDefaultMax: undefined,
        description: undefined,
        version: undefined,
        versionMin: undefined,
        versionMax: undefined,
        createTime: undefined,
        createTimeMin: undefined,
        createTimeMax: undefined,
        updateTime: undefined,
        updateTimeMin: undefined,
        updateTimeMax: undefined,
        isActive: undefined,
        isActiveMin: undefined,
        isActiveMax: undefined
      },
      dataDictCodes: ['YES_NO'],
      selects: {
        dictIsActiveSelect: [],
        isDefaultSelect: [],
        isActiveSelect: []
      }
    }
  },
  computed: {},
  mounted() {
    this.initDataDict()
    utils
      .getDataDict(this.dataDictCodes)
      .then(response => {
        if (response) {
          utils.getSelectDictItems({
            mainComponent: this,
            dataDictItems: response,
            dictCode: 'YES_NO',
            formProp: 'dictIsActive',
            dataProp: 'dictIsActiveSelect'
          })
          utils.getSelectDictItems({
            mainComponent: this,
            dataDictItems: response,
            dictCode: 'YES_NO',
            formProp: 'isDefault',
            dataProp: 'isDefaultSelect'
          })
          utils.getSelectDictItems({
            mainComponent: this,
            dataDictItems: response,
            dictCode: 'YES_NO',
            formProp: 'isActive',
            dataProp: 'isActiveSelect'
          })
        }
      })
      .catch(error => {
        console.log(error)
      })
  },
  methods: {
    initDataDict(){

    },
    resetForm(excludeProps) {
      for (const key in this.searchForm) {
        if (excludeProps && excludeProps.includes(key)) {
          continue
        }
        this.searchForm[key] = undefined
      }
    },
    handleSubmit() {
      this.$emit('quickSearch')
    },
    handleReset() {
      this.$emit('researchTable')
    }
  }
}
</script>
<style>
.ivu-quick-opt {
  text-align: right;
}
</style>
